import React, { Component } from "react";
import PropTypes from "prop-types"
import "./index.css";

export default class Header extends Component {

  static propTypes = {
    addTodo: PropTypes.func.isRequired
  }

  handleKeyUp = (e) => {
    if (e.keyCode !== 13) return;
    let value = e.target.value;
    if (!value) return alert("输入不能为空！");
    e.target.value = "";
    this.props.addTodo(value);
  };
  render() {
    return (
      <div className="header-box">
        <input
          type="text"
          onKeyUp={this.handleKeyUp}
          placeholder="请输入你的任务名称，按回车键确认"
        ></input>
      </div>
    );
  }
}
